<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>表情包大赏</title>
    <link rel="stylesheet" href="index.css">
    <style>
        .main {
            column-count: 4;
            column-gap: 0;
        }
        
        .item {
            padding: 4px;
        }
        
        .item img {
            display: block;
            width: 100%;
            height: auto;
        }
    </style>
</head>

<body>
    <div class="wrapin">
        <!--头部-->
        <div class="banner">
            <div class="box-1">
                <ul>
                    <li> <img src="image/轮播2.png"></img>
                    </li>
                </ul>
            </div>
            <div class="box-2">
                <ul>
                </ul>
            </div>
            <div class="box-3"> <span class="prev"> < </span> <span class="next"> > </span> </div>
        </div>
        <header>
            <ul class="nav clearfix">
                <li><a href="index.html">首页</a></li>
                <li><a href="jieshao.html">剧情故事</a></li>
                <li><a href="biaoqingbao.html">表情包大赏</a></li>
                <li><a href="denglu.html">登录/注册</a></li>
            </ul>
        </header>
        <!--内容-->
        <div class="main">
            <div class="item">
                <img src="image/表情包1.jfif">
            </div>
            <div class="item">
                <img src="image/表情包2.jfif">
            </div>
            <div class="item">
                <img src="image/表情包3.jfif">
            </div>
            <div class="item">
                <img src="image/表情包4.jfif">
            </div>
            <div class="item">
                <img src="image/表情包5.jfif">
            </div>
            <div class="item">
                <img src="image/表情包6.jfif">
            </div>
            <div class="item">
                <img src="image/表情包7.jfif">
            </div>
            <div class="item">
                <img src="image/表情包8.jfif">
            </div>
            <div class="item">
                <img src="image/表情包9.jfif">
            </div>
            <div class="item">
                <img src="image/表情包10.jfif">
            </div>
            <div class="item">
                <img src="image/表情包11.jfif">
            </div>
            <div class="item">
                <img src="image/12.jfif">
            </div>
            <div class="item">
                <img src="image/13.jfif">
            </div>
            <div class="item">
                <img src="image/14.jfif">
            </div>
            <div class="item">
                <img src="image/15.jfif">
            </div>
            <div class="item">
                <img src="image/16.jfif">
            </div>
            <div class="item">
                <img src="image/17.jfif">
            </div>
            <div class="item">
                <img src="image/18.jfif">
            </div>
            <div class="item">
                <img src="image/19.jfif">
            </div>
            <div class="item">
                <img src="image/20.jfif">
            </div>
            <div class="item">
                <img src="image/21.png">
            </div>
            <div class="item">
                <img src="image/22.png">
            </div>
            <div class="item">
                <img src="image/23.jfif">
            </div>
            <div class="item">
                <img src="image/24.jfif">
            </div>
            <div class="item">
                <img src="image/25.jfif">
            </div>
            <div class="item">
                <img src="image/26.jfif">
            </div>
            <div class="item">
                <img src="image/28.png">
            </div>
            <div class="item">
                <img src="image/29.gif">
            </div>
            <div class="item">
                <img src="image/30.jfif">
            </div>




        </div>
        <!--底部-->
        <footer>
            <p>新西游记</p>
        </footer>
    </div>
    <script type="text/javascript" src="js/js.js"></script>
    <audio controls="controls" autoplay="autoplay" hidden>
        <source src="audio/song.mp3" type="audio/mpeg" />
      Your browser does not support the audio element.
      </audio>
</body>

</html>